import React, { useState } from 'react';

export default function App() {
    const [text,Settext]=useState('')
    const [list,Setlist]=useState(['a','b'])
    const handleChange=(e)=>{
        console.log(e.target.value)
        Settext(e.target.value)
    }
    const handleClick=()=>{
        console.log(text)
        Setlist([...list,text])
        Settext('')
    }
    const handel=(item)=>{
        console.log(item)
        const newlist=[...list]
        newlist.splice(item,1)
        Setlist(newlist)
    }
  return (
    <div>
        <input onChange={handleChange} />
        <button onClick={handleClick}>add</button>
        <ul>
            {
                list.map((item,index)=><li key={item}>
                    <button onClick={()=>handel(index)}>del</button>
                    {item}</li>)
            }
            {!list.length&&<div>删光了</div>}
            
        </ul>
    </div>
  )
}
